<template>
	<div class="userPortrait">
		<div class="banner">
			<h1>大数据建立用户模型解析目标客户</h1>
			<p>智加云运用智能硬件以及智能软件采集用户场景数据，用户行为数据以及感知数据</p>
		</div>
		<div class="container1">
			<div class="title">关于用户画像</div>
			<div class="info">
				<p>智加云运用智能硬件以及智能软件采集用户场景数据，用户行为数据以及感知数据，</p>
				<p>挖掘每一个用户的人物属性、行为属性、社交网络、心理特征、兴趣爱好等数据，经过不断叠加、更新，抽象出完整的信息标签，组合并搭建出一个立体的用户虚拟模型。</p>
			</div>
			<div class="con con1">
				<img src="./img/product_yonghu_content1_icon1@3x.png" alt="">
				<h2>用户信息采集</h2>
				<p>自有感知节点采集线下用户行为数据+合作伙伴感知数据+其它类型的用户数据</p>
			</div>
			<div class="con con2">
				<img src="./img/product_yonghu_content1_icon2@3x.png" alt="">
				<h2>用户模型</h2>
				<p>以庞大的用户数据为依托，构建出一整套完善的用户模型，借助其标签化、信息化、可视化的属性，助力商家实现个性化推荐、精准营销</p>
			</div>
			<div class="con con3">
				<img src="./img/product_yonghu_content1_icon3@3x.png" alt="">
				<h2>品牌打造</h2>
				<p>通过大数据分析，将商家的潜在顾客以及会员顾客,做多维度分析助力商家品牌塑造</p>
			</div>
		</div>
	</div>
	
</template>

<script>
	export default {
		name: 'userPortrait',
	}
</script>

<style lang="stylus" scoped>
	.userPortrait{
		width: 100%;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		.banner{
			width: 100%;
			height: 5rem;
			background: url('./img/product_yhhx_banner.jpg') no-repeat;
			background-size: 100% 100%; 
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			h1{
				width: 43.2%;
				font-size: 0.36rem;
				color: #FFFFFF;
				margin: 0.5rem 0; 
				text-align: center;
				line-height: 1.5;
			}
			p{
				width: 72%;
				text-align: center;
				color: rgba(255,255,255,0.8);
				font-size: 0.24rem;
				line-height: 0.36rem;
			}
		}
		.container1{
			width: 100%;
			height: 17.19rem;
			overflow: hidden;
			display: flex;
			flex-direction: column;
			align-items: center;
			background: #F3F6FB;
			.title{
				font-size: 0.36rem;
				color: #333;
				margin: 0.6rem 0 0.5rem 0;
			}
			.info{
				margin-bottom: 0.5rem;
				p{
					width: 88%;
					font-size: 0.3rem;
					color: #666;
					line-height: 0.5rem;
					padding: 0 6%;
				}
			}
			.con{
				width: 92%;
				height: 3.3rem;
				margin-bottom: 0.4rem;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				&.con1{
					background: #3BAEFC;
				}
				&.con2{
					background: #3B73FC;
					height: 4.1rem;
				}
				&.con3{
					background: #723BFC
				}
				img{
					width: 0.98rem;
					height: 0.66rem;
					margin-bottom: 0.3rem;
				}
				h2{
					font-size: 0.3rem;
					color: #FFFFFF;
					margin-bottom: 0.2rem;
				}
				p{
					width: 65%;
					line-height: 0.4rem;
					font-size: 0.24rem;
					color: rgba(255,255,255,0.9);
					text-align: center;
				}
			}
		}
	}
</style>

